<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="../../../assets/docs.css" rel="stylesheet" type="text/css" media="screen" />
<title>MooTools 1.3 参考文档 - Utilities/Group</title>
</head>

<body>
  <div class="doc">
    <div class="methods">
      <h4 class="menu-item"><a href="#Group">Group</a></h4>
      <div class="menu-item"><a href="#Group:addEvent">addEvent</a></div>
    </div>
    <div class="l-border r-border span-15 content">
      <h1 id="Group"><a href="#Group">类: Group</a></h1>
      <p class="description">This class is for grouping Classes or Events. The Event added to the Group will fire when all of the events of the items of the group are fired.</p>
      <h3>语法</h3>
      <pre class="javascript"><span class="kw2">var</span> myGroup = <span class="kw2">new</span> Group<span class="br0">(</span><span class="kw2">class</span><span class="br0">[</span>, arrays<span class="br0">[</span>, class2<span class="br0">[</span>, ... <span class="br0">]</span><span class="br0">]</span><span class="br0">]</span><span class="br0">)</span>;

</pre>
      <h3>参数</h3>
      <p>Any number of Class instances, or arrays containing class instances.</p>
      <h3>返回值</h3>
      <ul>
        <li>(<em>object</em>) A new Group instance.</li>
      </ul>
      <h3>示例</h3>
      <pre class="javascript"><span class="kw2">var</span> xhr1 = <span class="kw2">new</span> Ajax<span class="br0">(</span><span class="st0">'data.js'</span>, <span class="br0">{</span>evalScript: <span class="kw2">true</span><span class="br0">}</span><span class="br0">)</span>;

<span class="kw2">var</span> xhr2 = <span class="kw2">new</span> Ajax<span class="br0">(</span><span class="st0">'abstraction.js'</span>, <span class="br0">{</span>evalScript: <span class="kw2">true</span><span class="br0">}</span><span class="br0">)</span>;
<span class="kw2">var</span> xhr3 = <span class="kw2">new</span> Ajax<span class="br0">(</span><span class="st0">'template.js'</span>, <span class="br0">{</span>evalScript: <span class="kw2">true</span><span class="br0">}</span><span class="br0">)</span>;

&nbsp;
<span class="kw2">var</span> group = <span class="kw2">new</span> Group<span class="br0">(</span>xhr1, xhr2, xhr3<span class="br0">)</span>;
group.<span class="me1">addEvent</span><span class="br0">(</span><span class="st0">'complete'</span>, <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>

    <span class="kw3">alert</span><span class="br0">(</span><span class="st0">'All Scripts loaded'</span><span class="br0">)</span>;
<span class="br0">}</span><span class="br0">)</span>;
&nbsp;
xhr1.<span class="me1">request</span><span class="br0">(</span><span class="br0">)</span>;
xhr2.<span class="me1">request</span><span class="br0">(</span><span class="br0">)</span>;
xhr3.<span class="me1">request</span><span class="br0">(</span><span class="br0">)</span>;

</pre>
      <h2 id="Group:addEvent"><a href="#Group:addEvent">Group Method: addEvent</a></h2>
      <p class="description">Adds an Event to the stack of Events of the Class instances.</p>
      <h3>语法</h3>
      <pre class="javascript">myGroup.<span class="me1">addEvent</span><span class="br0">(</span>type, fn<span class="br0">)</span>;

</pre>
      <h3>参数</h3>
      <ol>
        <li>type - (<em>string</em>) The event name (e.g. 'complete') to add.</li>
        <li>fn   - (<em>function</em>) The callback function to execute when all instances fired this event.</li>
      </ol>
      <h3>返回值</h3>
      <ul>
        <li>(<em>object</em>) This Group instance.</li>
      </ul>
      <h3>示例</h3>
      <pre class="javascript"><span class="kw2">var</span> myElements = $<span class="br0">(</span><span class="st0">'myForm'</span><span class="br0">)</span>.<span class="me1">getElements</span><span class="br0">(</span><span class="st0">'input, textarea, select'</span><span class="br0">)</span>;
myElements.<span class="me1">addEvent</span><span class="br0">(</span><span class="st0">'click'</span>, <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>

    <span class="kw3">alert</span><span class="br0">(</span><span class="st0">'an individual click'</span><span class="br0">)</span>;
<span class="br0">}</span><span class="br0">)</span>;
&nbsp;
<span class="kw2">var</span> myGroup = <span class="kw2">new</span> Group<span class="br0">(</span>myElements<span class="br0">)</span>;
myGroup.<span class="me1">addEvent</span><span class="br0">(</span><span class="st0">'click'</span>, <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>

    <span class="kw3">alert</span><span class="br0">(</span><span class="st0">'all form elements clicked'</span><span class="br0">)</span>;
<span class="br0">}</span><span class="br0">)</span>;
</pre>
      <h3>另参考</h3>
    </div>
  </div>
<script type="text/javascript" src="../../../assets/mootools-core-1.3.js"></script>
<script type="text/javascript" src="../../../assets/mootools-more-smoothscroll.js"></script>
<script type="text/javascript" src="../../../assets/doc-assist.js"></script>
</body>
</html>
